<!DOCTYPE html
		PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

	<title>Unobtrusive jQuery Truncate</title>

	<script src="../../_jquery/jquery-1.3.2.js"></script>
	<script src="../truncate.jquery.js" type="text/javascript"></script>

	<script src="truncate.example.js" type="text/javascript"></script>

	<style>
		<!--/*--><![CDATA[/*><!--*/
		.truncate_collapsed {
			border: 1px solid red;
			}
		/*]]>*/-->
	</style>
</head>
<body>
	<h2>Unobtrusive jQuery Truncate</h2>

	<h3>Truncating Regular Nodes</h3>
	<ul id="regular">
		<li>This node contains a lot of text but no HTML.</li>
		<li>This-node!contains:a;lot=of+text>but'no"HTML.</li>
		<li>This node <a href="#contains">contains</a> text <a href="#but">but</a> also a few links.</li>
		<li>ThisNodeHasAReallyLongWordAtTheBeginningOfIt and then some smaller words after.</li>
	</ul>

	<h3>Truncate Nodes But Leave Nodes With Children Alone</h3>
	<ul id="children">
		<li>This node contains a lot of text but no HTML.</li>
		<li>This-node!contains:a;lot=of+text>but'no"HTML.</li>
		<li>This node <a href="#contains">contains</a> text <a href="#but">but</a> also a few links.</li>
		<li>ThisNodeHasAReallyLongWordAtTheBeginningOfIt and then some smaller words after.</li>
	</ul>

	<h3>Example Of Various Settings</h3>
	<ul id="various">
		<li>This node contains a lot of text but no HTML.</li>
		<li>This-node!contains:a;lot=of+text>but'no"HTML.</li>
		<li>This node <a href="#contains">contains</a> text <a href="#but">but</a> also a few links.</li>
		<li>ThisNodeHasAReallyLongWordAtTheBeginningOfIt and then some smaller words after.</li>
	</ul>
</body>
</html>